<template>
  <page-body>
    <view class="page">
      <view class="flex benben-position-layout flex flex-wrap align-center home_flex_0"
        :style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx +'rpx', }">
        <view class='flex flex-wrap align-center justify-between flex-sub home_fd0_0'>
          <view class='flex flex-wrap align-center home_fd0_0_c0' @tap.stop="handleJumpDiy" data-type="back"
            data-url="1">
            <view>
              <benben-flex-tabs class-name='home_benbenTabsfd0_0_c0_c0' v-model="tabsTypefd0_0_c0_c0"
                ref="benben_tabsfd0_0_c0_c0" select-mark="benben_tabsfd0_0_c0_c0" key="benben_tabsfd0_0_c0_c0"
                :open-title-type='false' :open-sticky='true' :top='0' :is-show-content='false' :scrollspy='false'
                :tabs-info.sync="tabsInfofd0_0_c0_c0">

                <scroll-view @scroll="tabsInfofd0_0_c0_c0.scrollX = $event.detail.scrollLeft"
                  id="benben_tabsfd0_0_c0_c0" class="benben-tabs" style="width:750rpx" :scroll-x="true"
                  :scroll-left.sync="tabsInfofd0_0_c0_c0.moveX" scroll-with-animation="all .3s ease">
                  <view class="benben-tabs-content" id="benben_tabsfd0_0_c0_c0-content">
                    <view id="benben_tabsfd0_0_c0_c0-title"
                      class="benben-tabs-title flex flex align-center justify-around">
                      <view
                        :class="{ 'checkTitlefd0_0_c0_c0': tabsTypefd0_0_c0_c0 == '1', 'flex flex-wrap align-center': true }"
                        @tap.stop="chooseTab('1') " :id="`benben_tabsfd0_0_c0_c0-title-item-${'1'}`">

                        <text>关注</text>

                      </view>
                      <view
                        :class="{ 'checkTitlefd0_0_c0_c0': tabsTypefd0_0_c0_c0 == '0', 'flex flex-wrap align-center': true }"
                        @tap.stop="chooseTab('0')" :id="`benben_tabsfd0_0_c0_c0-title-item-${'0'}`">

                        <text>{{titleName}}</text>

                      </view>
                    </view>
                    <view :style="{ left: tabsInfofd0_0_c0_c0.lineleft, maxWidth: tabsInfofd0_0_c0_c0.lineWidth ,}"
                      id="benben_tabsfd0_0_c0_c0-line"
                      class="benben-tabs-line flex benben-flex-tabs-line home_linefd0_0_c0_c0"></view>
                  </view>
                </scroll-view>

              </benben-flex-tabs>

            </view>
          </view>
          <view class='flex flex-wrap align-center justify-end home_fd0_0_c0' @tap.stop="handleJumpDiy"
            data-type="navigateTo" :data-url="`/pages/homePage/sendPost/sendPost`">
            <image class='home_fd0_0_c1_c0' mode="aspectFit" :src='STATIC_URL+"195.png"'></image>
          </view>
        </view>

      </view>
      <view :style="{height: (90+StatusBarRpx)+'rpx'}"></view>
      <!---反馈记录带联系人flex布局开始-->
      <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout">
        <template v-for='(item,key0) in dataMessage'>
          <view class='flex flex-wrap align-start home_fd1_0' @tap.stop="handleJumpDiy" data-type="navigateTo"
            :data-url="`/pages/homePage/dongDetail/dongDetail?id=${item.aid}`" :key='key0'>
            <image class='home_fd1_0_c0' mode="aspectFill" :src='item.avatar'></image>
            <view class='flex flex-direction flex-wrap align-stretch flex-sub home_fd1_0_c1'>
              <view class='flex flex-wrap align-center justify-between home_fd1_0_c1_c0' @tap.stop="handleJumpDiy"
                data-type="navigateTo" :data-url="`/pages/grzx/userHome/userHome?aid=${item.user_id}`">
                <view class='flex flex-direction flex-wrap align-stretch home_fd1_0_c1_c0_c0'>
                  <text class='home_fd1_0_c1_c0_c0_c0'>{{item.user_name}}</text>
                  <view class='flex flex-wrap align-center home_fd1_0_c1_c0_c0_c1'>
                    <text @tap.stop="handleJumpDiy" data-type="navigateTo"
                      :data-url="`/pages/homePage/enterpriseDetails/enterpriseDetails?aid=${item.company_id}`"
                      v-if="item.company_name" class="home_fd1_0_c1_c0_c0_c1_c1 text-lg">{{item.company_name}}</text>
                    <text class=''>{{item.zhiye}}</text>
                  </view>
                </view>
                <!-- <view class='flex flex-wrap align-center' @click.stop="collect(item)">
                  <text class='home_fd1_0_c1_c0_c1_c0'>{{item.is_follow==0 ? '+关注' : '已关注'}}</text>
                </view> -->
              </view>
              <view class='flex flex-direction flex-wrap align-stretch home_fd1_0_c1_c1'>
                <view class='flex-sub home_fd1_0_c1_c1_c0'>
                  <view class='text-cut-3 home_fd1_0_c1_c1_c0_c0'>{{item.title}}</view>
                  <view v-if="item.title && item.title.length>60" class='text-df margin-top-sm'
                    style="color: rgb(94, 202, 113);">全文</view>
                </view>
              </view>
              <view class=' flex flex-wrap align-center home_fd1_0_c1_c2' v-if="item.postType=='image'">
                <template v-for='(child,key1) in item.thumb'>
                  <view class='flex flex-wrap align-center home_fd1_0_c1_c2_c0' :key='key1'>
                    <image class='home_fd1_0_c1_c2_c0_c0' mode="aspectFill" :src='child'
                      @tap.stop="multiImagePreview(child,item.thumb,'')"></image>
                  </view>
                </template>

              </view>
              <view class='flex flex-wrap align-center home_fd1_0_c1_c2' v-if="item.postType=='video'">
                <view class='flex flex-wrap align-center home_fd1_0_c1_c2_c0 position-relative'>
                  <image class=' home_fd1_0_c1_c2_c0_c0' mode="aspectFill" :src='item.video_img'>
                  </image>
                  <image class='playd' mode="aspectFit" :src='STATIC_URL+"playd.png"'></image>
                </view>

              </view>
              <view class='flex flex-wrap align-center'>
                <!-- <text class='home_fd1_0_c1_c3_c0'>{{item.create_time}}</text> -->
                <!-- <text class='home_fd1_0_c1_c3_c1'>距离：{{item.distance || 0}}</text> -->
              </view>
              <view class='flex flex-wrap align-center justify-between home_fd1_0_c1_c4'>
                <!-- <view class='flex flex-wrap align-center'>
                  <image class='home_fd1_0_c1_c4_c0_c0' mode="aspectFit" :src='STATIC_URL+"158.png"'></image>
                  <text class='home_fd1_0_c1_c4_c0_c1'>{{item.share_count }}</text>
                </view> -->
                <text class='home_fd1_0_c1_c4_c0_c1'>{{item.create_time }}</text>
                <view class='flex flex-wrap align-center'>
                  <image class='home_fd1_0_c1_c4_c0_c0' mode="aspectFit" :src='STATIC_URL+"159.png"'></image>
                  <text class='home_fd1_0_c1_c4_c0_c1'>{{item.comment_count }}</text>
                </view>
                <view class='flex flex-wrap align-center' @click.stop="like(item)">
                  <image class='home_fd1_0_c1_c4_c0_c0' v-if="item.isLike==1" mode="aspectFit"
                    :src='STATIC_URL+"161.png"'></image>
                  <image class='home_fd1_0_c1_c4_c0_c0' v-if="item.isLike==0" mode="aspectFit"
                    :src='STATIC_URL+"189.png"'></image>
                  <text class='home_fd1_0_c1_c4_c0_c1'>{{item.like_count }}</text>
                </view>
              </view>
            </view>
          </view>
        </template>
        <fu-empty :pagingListLoadedAll="pagingListLoadedAll" :pagingListNoListData="pagingListNoListData"
          :listDataLength="listDataLength" :isLoadInit="isLoadInit"></fu-empty>
      </view>

      <!---反馈记录带联系人flex布局结束-->
      <benben-popup v-model="popupShow1717481164302" :mask="true" :mask-close-able="true" mode='center' :z-index='999'>
        <!---flex布局flex布局开始-->
        <view class="flex benben-flex-layout flex-wrap align-center">
          <view class='flex flex-direction flex-wrap align-center home_fd2_0'>
            <image class='home_fd2_0_c0' mode="aspectFit" :src='STATIC_URL+"177.png"'></image>
            <text class='home_fd2_0_c1'>送你新人见面礼</text>
            <text class='home_fd2_0_c2'>{{regScore || 0}}</text>
            <text class='home_fd2_0_c3'>平台币</text>
          </view>
        </view>

        <!---flex布局flex布局结束-->

      </benben-popup>


    </view>
    <app-update ref="update" :auto="true"></app-update>
  </page-body>
</template>
<script>
  import pagingList from '@/common/mixin/paging_list.js';
  import {
    validate
  } from '@/common/utils/validate.js';
  import {
    TUILogin
  } from "@tencentcloud/tui-core";
  import {
    SYSTEM_CONFIG,
    SDKAppID,
    secretKey
  } from "@/common/config.js";
  import {
    TUIChatKit,
    genTestUserSig
  } from "@/TUIKit";
  import {
    vueVersion
  } from "@/TUIKit/adapter-vue";
  import TencentCloudChat from '@tencentcloud/chat';
  import {
    TUIConversationService
  } from '@tencentcloud/chat-uikit-engine';

  export default {
    components: {},
    mixins: [pagingList],

    data() {
      return {
        "popupShow1717481164302": false,
        "tabsInfofd0_0_c0_c0": {
          lineleft: '',
          lineWidth: '',
          moveX: 0,
          scrollX: 0,
          PageScrollX: 0
        },
        "tabsTypefd0_0_c0_c0": "1",
        "minixPagingListsApi": "",
        "pageingListApiMethod": "",
        "allowOnloadGetList": false,
        "dataMessage": [],
        is_new: '',
        regScore: 0,
        cityname: '',
        citycode: '',
        region_code: '',
        lat: '',
        lng: '',
        titleName: ""
      };
    },
    computed: {
      isLogin() {
        return this.$store.state.token == '' ? false : true;
      }
    },
    watch: {},
    onLoad(options) {
      if (global.appTabBarType) this.toHomeDiy()
      let that = this
      that.getListFunc()
      // return;
      // if (uni.getStorageSync('cityinfo')) {
      //   that.cityinfo = JSON.parse(uni.getStorageSync('cityinfo'))
      //   that.lat = that.cityinfo.lat
      //   that.lng = that.cityinfo.lng
      //   that.cityname = that.cityinfo.text
      //   that.citycode = that.cityinfo.code
      //   that.region_code = that.cityinfo.code
      //   console.log('that.citycode', that.region_code)
      //   that.getListFunc()
      // } else {
      //   that.getLocation()
      // }
      if (this.isLogin) {
        const userID = this.userInfo ? this.userInfo.id.toString() : '';
        let config = {
          userID: userID, //User ID
          SDKAppID: SDKAppID, // Your SDKAppID
          secretKey: secretKey, // Your secretKey
        }
        const userSig = genTestUserSig(config).userSig;
        TUILogin.login({
          SDKAppID: config.SDKAppID,
          userID: config.userID,
          userSig: userSig,
          // 如果您需要发送图片、语音、视频、文件等富媒体消息，请设置为 true
          useUploadPlugin: true,
          useProfanityFilterPlugin: false,
          framework: `vue${vueVersion}` // 当前开发使用框架 vue2 / vue3
        }).then(() => {
          if (TUILogin.chat.isReady()) {
            let nums = TUILogin.chat.getTotalUnreadMessageCount();
            that.getData(nums)
          }
        })
        this.$api.post(global.apiUrls.post665d2bb0f0f7c).then(res => {
          if (res.data.code == 1) {
            this.regScore = res.data.data.regScore
            this.titleName = res.data.data.titleName
            console.log('pppp', res.data.data)
            this.getUser()
          }
        })
      }
    },
    onUnload() {

    },
    onReady() {
      // #ifdef APP
      this.$util.debounce(
        () => {
          this.$refs.update.checkAppUpdate()
        },
        1000,
        true
      )
      // #endif

    },
    mounted() {
      uni.$on('like', res => {
        this.dataMessage.map(item => {
          if (item.aid == res.id) {
            if (item.isLike == 0) {
              item.isLike = 1
              item.like_count = item.like_count + 1
            } else {
              item.isLike = 0
              item.like_count = item.like_count - 1
            }
          }
        })
      })
      uni.$on('pinglun', res => {
        this.dataMessage.map(item => {
          if (item.aid == res.id) {
            item.comment_count = item.comment_count + 1
          }
        })
      })
      uni.$on('zhuanfa', res => {
        this.dataMessage.map(item => {
          if (item.aid == res.id) {
            item.share_count = item.share_count + 1
          }
        })
      })
    },
    onShow() {
      // let that = this
      // if (uni.getStorageSync('cityinfo')) {
      //   that.cityinfo = JSON.parse(uni.getStorageSync('cityinfo'))
      //   that.lat = that.cityinfo.lat
      //   that.lng = that.cityinfo.lng
      //   that.cityname = that.cityinfo.text
      //   that.citycode = that.cityinfo.code
      //   that.region_code = that.cityinfo.code
      //   console.log('that.citycode', that.region_code)
      //   that.getListFunc()
      // } else {
      //   that.getLocation()
      // }
      // if (this.isLogin) {
      //   const userID = this.userInfo ? this.userInfo.id.toString() : '';
      //   let config = {
      //     userID: userID, //User ID
      //     SDKAppID: SDKAppID, // Your SDKAppID
      //     secretKey: secretKey, // Your secretKey
      //   }
      //   const userSig = genTestUserSig(config).userSig;
      //   TUILogin.login({
      //     SDKAppID: config.SDKAppID,
      //     userID: config.userID,
      //     userSig: userSig,
      //     // 如果您需要发送图片、语音、视频、文件等富媒体消息，请设置为 true
      //     useUploadPlugin: true,
      //     useProfanityFilterPlugin: false,
      //     framework: `vue${vueVersion}` // 当前开发使用框架 vue2 / vue3
      //   }).then(() => {
      //     if (TUILogin.chat.isReady()) {
      //       let nums = TUILogin.chat.getTotalUnreadMessageCount();
      //       that.getData(nums)
      //     }
      //   })
      //   this.$api.post(global.apiUrls.post665d2bb0f0f7c).then(res => {
      //     if (res.data.code == 1) {
      //       this.regScore = res.data.data.regScore
      //       console.log('pppp', res.data.data)
      //       this.getUser()
      //     }
      //   })
      // }
      // this.getListFunc()
    },
    onHide() {
      this.popupShow1717481164302 = false
      if (this.isLogin) {
        this.$api.post(global.apiUrls.post5cb54af125f1c, {
          is_new: '1'
        }).then(res => {

        })
      }

    },
    onResize() {

    },
    onPullDownRefresh() {

    },
    onReachBottom(e) {

    },
    onPageScroll(e) {

    },
    methods: {
      getData(nums) {
        this.$api.post(global.apiUrls.post64241ca6cf066).then(res => {
          if (res.data.code == 1) {
            this.likeCount = res.data.data.likeCount
            this.commentCount = res.data.data.commentCount
            this.fanCount = res.data.data.fanCount
            this.articleNum = res.data.data.article
            let allNum = res.data.data.all
            let all = parseFloat(nums) + parseFloat(allNum)
            if (all) {
              uni.setTabBarBadge({
                index: 2,
                text: all.toString()
              })
            } else {
              uni.removeTabBarBadge({
                index: 2
              })
            }
          }
        })
      },
      getLocation() {
        let that = this
        let brand = uni.getSystemInfoSync().brand
        // #ifdef APP
        uni.showModal({
          title: '位置授权信息提示',
          content: '用于获取周边信息',
          success: function(res1) {
            if (res1.confirm) {
              uni.getLocation({
                type: 'gcj02',
                geocode: true,
                success: (res) => {
                  that.lat = res.latitude;
                  that.lng = res.longitude;
                  that.$api.post(global.apiUrls.post6524b6d2a8964, {
                    lng: that.lng,
                    lat: that.lat
                  }).then(ress => {
                    if (ress.data.code == 1) {
                      console.log(',,,,,,', ress.data.data)
                      that.cityname = ress.data.data.city
                      that.citycode = ress.data.data.citycode
                      that.region_code = ress.data.data.citycode
                      let cityall = {
                        lat: that.lat,
                        lng: that.lng,
                        text: that.cityname,
                        code: that.region_code,
                        province: ress.data.data.province,
                        provinceCode: ress.data.data.provinceCode
                      }
                      console.log('lllllll', cityall)
                      uni.setStorageSync('cityinfo', JSON.stringify(cityall))
                      that.getListFunc()
                    }
                  })
                },
                complete: (complete) => {
                  console.log('complete', complete)
                }
              })
            }
          }
        })

        // #endif
        // #ifdef H5
        that.getListFunc()
        // #endif

      },
      getUser() {
        // this.popupShow1717481164302 = true
        this.$api.post(global.apiUrls.post5c78c4772da97).then(res => {
          if (res.data.code == 1) {
            this.is_new = res.data.data.is_new
            if (this.is_new == 0) {
              setTimeout(result => {
                this.popupShow1717481164302 = true
              }, 500)

            }
          }
        })
      },
      chooseTab(type) {
        this.tabsTypefd0_0_c0_c0 = type
        this.getListFunc()
      },
      collect(item) {
        this.$api.post(global.apiUrls.post66505b8b64564, {
          user_id: item.postUserId
        }).then(res => {
          if (res.data.code == 1) {
            if (item.is_follow == 1) {
              item.is_follow = 0
            } else {
              item.is_follow = 1
            }
          } else {
            this.$message.info(res.data.msg)
          }
        })
      },
      like(item) {
        this.$api.post(global.apiUrls.post6459b3da18828, {
          post_id: item.aid
        }).then(res => {
          if (res.data.code == 1) {
            if (item.isLike == 1) {
              item.isLike = 0
              item.like_count = item.like_count - 1
            } else {
              item.isLike = 1
              item.like_count = item.like_count + 1
            }
            console.log(item.isLike)
          } else {
            this.$message.info(res.data.msg)
          }
        })
      },
      //用户管理-意见反馈记录
      getListFunc() {
        console.log('this.cityname', this.cityname)
        this.minixPagingListsApi = global.apiUrls.post6458a3d122c06;
        this.pageingListApiMethod = 'post';
        this.allowOnloadGetList = false;
        this.pagingListPostDataContent = {
          typesearch: this.tabsTypefd0_0_c0_c0,
          city: this.cityname,
          lat: this.lat,
          lng: this.lng,
        }
        this.listData = [];
        this.dataMessage = this.listData;
        this.pagingListToggle();

      },
      pagingListPostData() {
        return this.pagingListPostDataContent
      }
    }
  };
</script>
<style lang="scss" scoped>
  .playd {
    width: 60rpx;
    height: 60rpx;
    position: absolute;
    top: 33%;
    left: 33%;
  }

  .page {
    width: 100vw;
    overflow-x: hidden;
    min-height: calc(100vh - var(--window-bottom));
    background: #F8F8F8;
    background-size: 100% auto;
    // background: url(image-path('154.png')) no-repeat;
  }

  .home_flex_0 {
    background: url(image-path('154.png')) no-repeat;
    width: 750rpx;
    height: 120rpx;
    overflow: hidden;
    z-index: 10;
    top: 0rpx;
    background-size: 100% 100% !important;
  }

  .home_fd0_0_c1_c0 {
    width: 40rpx;
    height: 40rpx;
  }

  .home_linefd0_0_c0_c0 {
    background: var(--benbenbgColor2);
    width: 100rpx;
    height: 8rpx;
    top: 70rpx;
    background-size: 100% 100% !important;
    border-radius: 44rpx;
  }

  .checkTitlefd0_0_c0_c0 {
    font-weight: 700 !important;
    font-size: 30rpx !important;
    color: #5ECA71 !important;
    background-color: rgba(255, 255, 255, 1) !important;
  }

  ::v-deep .home_benbenTabsfd0_0_c0_c0 {
    width: 350rpx;
    white-space: nowrap;
    text-align: center;
    height: 88rpx;
  }

  .home_fd0_0_c0 {
    width: 120rpx;
  }

  .home_fd0_0 {
    padding: 0rpx 32rpx 0rpx 32rpx;
  }

  .home_fd1_0_c1_c4_c0_c1 {
    color: var(--benbenFontColor2);
  }

  .home_fd1_0_c1_c4_c0_c0 {
    width: 32rpx;
    height: 32rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
    margin: 0rpx 12rpx 0rpx 0rpx;
  }

  .home_fd1_0_c1_c4 {
    margin: 24rpx 0rpx 0rpx 0rpx;
  }

  .home_fd1_0_c1_c3_c1 {
    line-height: 33rpx;
    font-size: 24rpx;
    font-weight: 400;
    color: var(--benbenFontColor2);
    margin: 0rpx 0rpx 0rpx 24rpx;
  }

  .home_fd1_0_c1_c3_c0 {
    line-height: 33rpx;
    font-size: 24rpx;
    font-weight: 400;
    color: var(--benbenFontColor2);
  }

  .home_fd1_0_c1_c2_c0_c0 {
    width: 180rpx;
    height: 180rpx;
    border-radius: 16rpx 16rpx 16rpx 16rpx;
  }

  .home_fd1_0_c1_c2_c0 {
    margin: 12rpx 0 12rpx 8rpx;

  }

  .home_fd1_0_c1_c2 {
    padding: 12rpx 0rpx 0rpx 8rpx;
  }

  .home_fd1_0_c1_c1_c0_c0 {
    line-height: 46rpx;
    font-size: 32rpx;
    font-weight: 400;
    color: var(--benbenFontColor0);
    padding: 0rpx 30rpx 0rpx 0rpx;
  }

  .home_fd1_0_c1_c1_c0 {
    color: rgba(119, 119, 119, 1);
  }

  .home_fd1_0_c1_c1 {
    position: relative;
    padding: 0rpx 0rpx 0rpx 16rpx;
  }

  .home_fd1_0_c1_c0_c1_c0 {
    font-size: 24rpx;
  }

  .home_fd1_0_c1_c0_c0_c1_c1 {
    color: var(--benbenFontColor2);
    margin: 0rpx 24rpx 0rpx 0;
  }

  .home_fd1_0_c1_c0_c0_c1 {
    font-size: 28rpx;
    margin: 06rpx 0rpx 0rpx 0rpx;
  }

  .home_fd1_0_c1_c0_c0_c0 {
    // font-weight: 600;
    font-size: 32rpx;
  }

  .home_fd1_0_c1_c0_c0 {
    margin: 0rpx 0rpx 0rpx 16rpx;
  }

  .home_fd1_0_c1_c0 {
    margin: 0rpx 0rpx 12rpx 0rpx;
  }

  .home_fd1_0_c1 {
    margin: 0rpx 0rpx 0rpx 0rpx;
  }

  .home_fd1_0_c0 {
    width: 80rpx;
    height: 80rpx;
    border-radius: 16rpx;
  }

  .home_fd1_0 {
    border-bottom: 1px solid #eee;
    padding: 24rpx;
    width: 702rpx;
    margin: 24rpx auto 0rpx auto;
    box-shadow: 0rpx 3rpx 6rpx 1rpx rgba(0, 0, 0, 0.1);
  }

  .home_fd2_0_c3 {
    color: rgba(211, 152, 80, 1);
    font-size: 32rpx;
  }

  .home_fd2_0_c2 {
    font-size: 110rpx;
    color: rgba(211, 152, 80, 1);
    margin: 24rpx 0rpx 0rpx 0rpx;
    font-weight: 500;
  }

  .home_fd2_0_c1 {
    font-size: 32rpx;
    color: rgba(119, 119, 119, 1);
  }

  .home_fd2_0_c0 {
    width: 268rpx;
    height: 62rpx;
    margin: 130rpx 0rpx 0rpx 0rpx;
  }

  .home_fd2_0 {
    background: url(image-path('176.png')) no-repeat;
    width: 553rpx;
    height: 700rpx;
    background-size: 100% 100%;
  }
</style>
